import Vue from 'vue';
import Vuex from 'vuex';

export const ADD_CART = 'ADD_CART'
export const REDUCE_CART = 'REDUCE_CART'

Vue.use(Vuex);
const state = {
    goods: [
        {
            id: '0',
            name: 'vivo-X20Plus屏幕指纹版',
            hint: '逆光也清晰，照亮你的美',
            price: 3596.00,
            num: 0,
            img: require('../assets/v.jpg')
          },
          {
            id: '1',
            name: '华为mate10Plus',
            hint: '真正的人工智能芯片',
            price: 4999.00,
            num: 0,
            img: require('../assets/h.jpeg')
          },
          {
            id: '2',
            name: '华为mate10Plus',
            hint: '真正的人工智能芯片',
            price: 4999.00,
            num: 0,
            img: require('../assets/v.jpg')
          }
    ],
    totalPrice: 0.00,
    totalNum: 0
}

const getters = {
    goods_obj: state => state.goods,
    goods_length: state => state.goods.length
}

const mutations = {
    [ADD_CART] (state,id){
        state.goods[id].num++,
        state.totalNum++,
        state.totalPrice += state.goods[id].price
    },
    [REDUCE_CART] (state, id){
        // 购物车的东西要大于 才能进行减少物品
        if(state.goods[id].num > 0){
            state.goods[id].num--,
            state.totalNum--,
            state.totalPrice -= state.goods[id].price
        }
    }
}

export default new Vuex.Store({
    state,
    getters,
    mutations
})